<template>
  <div class="packages">
    <div ref="refsTable"  >
      <el-form style="margin-top: 10px" :inline="true" label-width="68px">
        <el-form-item label="登记时间">
          <el-date-picker
            v-model="value1"
            type="datetimerange"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            value-format="yyyy-MM-dd HH:mm:ss"
            @change="timeChange1"
            style="width:380px"
            :default-time="['00:00:00', '23:59:59']"
            :picker-options="pickerOptions"
          ></el-date-picker>
        </el-form-item>

        <el-form-item label="入库时间">
          <el-date-picker
            v-model="value2"
            type="datetimerange"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            value-format="yyyy-MM-dd HH:mm:ss"
            @change="timeChange2"
            style="width:380px"
            :default-time="['00:00:00', '23:59:59']"
            :picker-options="pickerOptions"
          ></el-date-picker>
        </el-form-item>

        <el-form-item label="项目类型">
          <el-autocomplete
            class="inline-input"
            v-model="params.projectTypeName"
            :fetch-suggestions="querySearch"
            placeholder="请选择"
            @select="handleSelectProject"
            @focus="change(1)"
            style="width:228px"
            clearable
          ></el-autocomplete>
          <!-- <el-select v-model="params.projectType" placeholder="请选择" style="width:228px">
            <el-option value label="全部"></el-option>
            <el-option
              v-for="item in Arr.projectTypeArr"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            ></el-option>
          </el-select> -->
        </el-form-item>

        <el-form-item label="样本类型">
          <el-autocomplete
            class="inline-input"
            v-model="params.sampleTypeName"
            :fetch-suggestions="querySearch"
            placeholder="请选择"
            @select="handleSelectSample"
            @focus="change(0)"
            style="width:228px"
            clearable
          ></el-autocomplete>
          <!-- <el-select v-model="params.sampleType" placeholder="请选择" style="width:228px">
            <el-option value label="全部"></el-option>
            <el-option
              v-for="item in Arr.sampleTypeArr"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            ></el-option>
          </el-select> -->
        </el-form-item>

        <el-form-item label="核酸类型">
          <el-select v-model="params.nucleicAcidType" placeholder="请选择" style="width:228px">
            <el-option value label="全部"></el-option>
            <el-option
              v-for="item in Arr.nucleicAcidTypeArr"
              :key="item.id"
              :label="item.typeName"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="平台类型">
          <el-select v-model="params.platformType" placeholder="请选择" style="width:228px">
            <el-option value label="全部"></el-option>
            <el-option
              v-for="item in Arr.platformTypeArr"
              :key="item.id"
              :label="item.platformType"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="条码号">
          <!-- <el-autocomplete
            class="inline-input"
            v-model="params.barcodeCode"
            :fetch-suggestions="querySearch"
            placeholder="请输入条码号"
            @select="handleSelect"
            @focus="change(0)"
            style="width:228px"
          ></el-autocomplete> -->
          <el-input clearable v-model="params.barcodeCode" style="width:228px" placeholder="请输入条码号"></el-input>
        </el-form-item>

        <el-form-item label="实验编号">
          <!-- <el-autocomplete
            class="inline-input"
            v-model="params.experimentNumber"
            :fetch-suggestions="querySearch"
            placeholder="实验编号或流水号"
            @select="handleSelect"
            @focus="change(0)"
            style="width:228px"
          ></el-autocomplete> -->
          <el-input clearable v-model="params.experimentNumber" style="width:228px" placeholder="实验编号或流水号"></el-input>
        </el-form-item>

        <el-form-item label="入库状态">
          <el-select v-model="params.inputState" placeholder="请选择" style="width:228px">
            <el-option value label="全部"></el-option>
            <el-option
              v-for="item in arr.entryStateArr"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="实验状态">
          <el-select v-model="params.experimentalStatus" placeholder="请选择" style="width:228px">
            <el-option value label="全部"></el-option>
            <el-option
              v-for="item in arr.experimentalStatusArr"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="关键字">
          <!-- <el-autocomplete
            class="inline-input"
            v-model="params.keyword"
            :fetch-suggestions="querySearch"
            placeholder="请输入关键字"
            @select="handleSelect"
            @focus="change(1)"
            style="width:228px"
          ></el-autocomplete> -->
          <el-input clearable v-model="params.keyword" style="width:228px" placeholder="送检单位/姓名/入库批次号"></el-input>
        </el-form-item>

        <el-form-item>
          <el-button  size="mini" icon="el-icon-search" type="primary" @click="getList">查询</el-button>
          <el-button  size="mini" icon="el-icon-refresh" @click="reset">重置</el-button>
        </el-form-item>
        
      </el-form>
      <el-form :inline="true">
        <el-form-item>
          <el-button size="mini" class="button-lan" type="primary" @click="entryHouse">入库</el-button>
        </el-form-item>
        <el-form-item style="margin-left: 10px">
          <el-button size="mini" class="button-lan" type="primary" @click="cancelEntryHouse">取消入库</el-button>
        </el-form-item>
        <el-form-item style="margin-left: 10px;float:right">
          <el-dropdown trigger="click" placement="bottom" @command="handleCommand">
            <el-button size="mini" type="primary">
              导出
              <i class="el-icon-arrow-down el-icon--right"></i>
            </el-button>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item command="20">导出当前</el-dropdown-item>
              <el-dropdown-item command="99999">导出全部</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </el-form-item>
      </el-form>
    </div>

    <el-table
      ref="multipleTable"
      :data="tableData"
      border
      tooltip-effect="dark"
      style="width:100%"
      @selection-change="handleSelectionChange"
      :header-cell-style="{ 
      background:'#ebebeb'}"
      highlight-current-row
      :row-class-name="rowStyle"
      :height="heights"
      v-loading="loading"
    >
      <el-table-column align="center" type="selection" width="55"></el-table-column>
      <el-table-column align="center" type="index" width="50" label="序号"></el-table-column>
      <el-table-column align="center" prop="barcodeCode" label="条码号" width="120"></el-table-column>
      <el-table-column width="380" align="center" prop="projectTypeName" label="项目类型"></el-table-column>
      <el-table-column align="center" prop="experimentNumber" label="实验编号" width="200"></el-table-column>
      <el-table-column align="center" prop="sampleState" label="样本状态" width="100">
        <template slot-scope="{row}">{{row.sampleState==1?'已入库':'已登记'}}</template>
        <!-- <template slot-scope="{row}">{{ arr.mainStateObj[row.mainState] }}</template> -->
      </el-table-column>
      <el-table-column align="center" prop="inputState" label="入库状态">
        <template slot-scope="{row}">{{row.inputState==0?'待入库':'已入库'}}</template>
      </el-table-column>
      <el-table-column align="center" prop="inputSampleNumber" label="入库样本编号" width="200"></el-table-column>
      <el-table-column align="center" prop="inputBatchNumber" label="入库批次号" width="150"></el-table-column>
      <el-table-column align="center" prop="registrationTime" label="登记时间" show-overflow-tooltip width="160"></el-table-column>
      <el-table-column align="center" prop="submitName" label="送检姓名"></el-table-column>
      <el-table-column align="center" prop="inspectionUnit" label="送检单位" width="200" show-overflow-tooltip></el-table-column>
      <el-table-column align="center" prop="professionalGroupName" label="专业组" width="200" show-overflow-tooltip></el-table-column>
      <el-table-column align="center" prop="platformTypeName" label="平台类型"></el-table-column>
      <el-table-column align="center" prop="nucleicAcidName" label="核酸类型" width='100'></el-table-column>
      <el-table-column align="center" prop="sampleTypeName" label="样本类型" width="150" show-overflow-tooltip></el-table-column>
      <el-table-column align="center" prop="otherSampleTypes" label="其他样本类型" width="150"></el-table-column>
      <el-table-column align="center" prop="inputPerson" label="入库人"></el-table-column>
      <el-table-column align="center" prop="inputDate" label="入库日期" show-overflow-tooltip width='160'></el-table-column>
      <el-table-column align="center" prop="experimentalStatus" label="是否符合实验" width='100'>
        <template
          slot-scope="{row}"
        >{{row.experimentalStatus==1?'符合要求':(row.experimentalStatus==0?'未符合实验要求':'')}}</template>
      </el-table-column>
      <el-table-column align="center" prop="isOutsourcers" label="是否流转外包商" width="150">
        <template slot-scope="{row}">{{row.isOutsourcers==1?'是':'否'}}</template>
      </el-table-column>
      <el-table-column align="center" prop="isVoid" label="是否作废">
        <template slot-scope="{row}">{{row.isVoid==1?'是':'否'}}</template>
      </el-table-column>
      <el-table-column align="center" prop="reasonName" label="作废原因" width="100" show-overflow-tooltip></el-table-column>
      <el-table-column align="center" prop="remark" label="备注" width="100" show-overflow-tooltip></el-table-column>
      <el-table-column align="center" label="操作" width="100" fixed="right" class-name="small-padding fixed-width" >
        <template slot-scope="scope">
          <div class="czDiv">
            <span style="color:#0186ef;cursor:pointer" @click="edit(scope.row)">编辑</span>
            <span
              v-show="scope.row.isVoid==0"
              style="color:#0186ef;cursor:pointer"
              @click="nullify(scope.row.id,scope.row.stateId,scope.row)"
            >作废</span>
            <span
              v-show="scope.row.isVoid==1"
              style="color:#0186ef;cursor:pointer"
              @click="toEnabled(scope.row.id,scope.row)"
            >启用</span>
          </div>
        </template>
      </el-table-column>
    </el-table>

    <el-dialog :visible.sync="nullifyDialog" style="margin-top:15vh;" title="提示" width="500px">
      <el-form
        :model="ruleForm4"
        :rules="rules4"
        class="demo-ruleForm"
        ref="ruleForm4"
        :inline="true"
      >
        <el-form-item label="请输入作废原因" prop="dictReasonId">
          <el-select v-model="ruleForm4.dictReasonId" placeholder="请选择" style="width:320px">
            <el-option
              v-for="item in Arr.reasonNameArr"
              :key="item.id"
              :label="item.reasonName"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-form>

      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="nullifyDialog = false">取 消</el-button>
        <el-button size="mini" type="primary" @click="sureToNullify('ruleForm4')">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 编辑 -->
    <el-dialog :visible.sync="dialogVisible" width="750px" title="入库：编辑">
      <el-form
        :model="ruleForm"
        :rules="rules"
        ref="ruleForm"
        label-width="110px"
        class="demo-ruleForm"
        :inline="true"
        size="mini"
      >
        <el-form-item label="条码号">
          <el-input clearable style="width:210px" v-model="ruleForm.barcodeCode" disabled></el-input>
        </el-form-item>
        <el-form-item label="项目类型">
          <el-input clearable style="width:210px" v-model="ruleForm.projectTypeName" disabled></el-input>
        </el-form-item>
        <el-form-item label="实验编号">
          <el-input clearable style="width:210px" v-model="ruleForm.experimentNumber" disabled></el-input>
        </el-form-item>
        <el-form-item label="样本状态">
          <el-input clearable style="width:210px" v-model="arr.sampleStateObj[ruleForm.sampleState]" disabled></el-input>
        </el-form-item>
        <el-form-item label="入库样本编号">
          <el-input clearable style="width:210px" v-model="ruleForm.inputSampleNumber" disabled></el-input>
        </el-form-item>
        <el-form-item label="入库批次号">
          <el-input clearable style="width:210px" v-model="ruleForm.inputBatchNumber" disabled></el-input>
        </el-form-item>
        <el-form-item label="录入时间">
          <el-input clearable style="width:210px" v-model="ruleForm.registrationTime" disabled></el-input>
        </el-form-item>
        <el-form-item label="入库日期">
          <el-input clearable style="width:210px" v-model="ruleForm.inputDate" disabled></el-input>
        </el-form-item>
        <el-form-item label="送检姓名">
          <el-input clearable style="width:210px" v-model="ruleForm.submitName" disabled></el-input>
        </el-form-item>
        <el-form-item label="送检单位">
          <el-input clearable style="width:210px" v-model="ruleForm.inspectionUnit" disabled></el-input>
        </el-form-item>
        <el-form-item label="核酸类型">
          <el-input clearable style="width:210px" v-model="ruleForm.nucleicAcidName" disabled></el-input>
        </el-form-item>
        <el-form-item label="样本类型">
          <el-input clearable style="width:210px" v-model="ruleForm.sampleTypeName" disabled></el-input>
        </el-form-item>
        <el-form-item label="平台类型">
          <el-input clearable style="width:210px" v-model="ruleForm.platformTypeName" disabled></el-input>
        </el-form-item>
        <el-form-item label="是否符合实验" prop="experimentalStatus" style="margin-bottom:19px">
          <el-select v-model="ruleForm.experimentalStatus" placeholder="请选择" style="width:210px">
            <el-option
              v-for="item in arr.experimentalStatusArr"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="作废原因">
          <el-input type="textarea" clearable style="width:540px" v-model="ruleForm.reasonName" disabled></el-input>
        </el-form-item>
        <el-form-item label="备注">
          <el-input type="textarea" clearable  v-model="ruleForm.remark" placeholder="请输入备注" style="width:540px"></el-input>
        </el-form-item>
        <el-menu
          class="el-menu-vertical-demo"
          @open="handleOpen"
          @close="handleClose"
          :default-openeds="['1']"
        >
          <el-submenu index="1">
            <template slot="title">
              <span>临床信息</span>
            </template>
            <el-form-item label="白细胞(10⁹/L)">
              <el-input clearable style="width:210px" v-model="ruleForm.whiteBloodCells"></el-input>
            </el-form-item>
            <el-form-item label="中性粒(%)">
              <el-input clearable style="width:210px" v-model="ruleForm.neutralGrain"></el-input>
            </el-form-item>
            <el-form-item label="淋巴细胞(%)">
              <el-input clearable style="width:210px" v-model="ruleForm.lymphocyte"></el-input>
            </el-form-item>
            <el-form-item label="CRP(mg/L)">
              <el-input clearable style="width:210px" v-model="ruleForm.crp"></el-input>
            </el-form-item>
            <el-form-item label="PCT(mg/L)">
              <el-input clearable style="width:210px" v-model="ruleForm.pct"></el-input>
            </el-form-item>
            <el-form-item label="前端备注">
              <el-input clearable style="width:210px" v-model="ruleForm.frontendNote"></el-input>
            </el-form-item>
            <el-form-item label="提取浓度">
              <el-input clearable style="width:210px" v-model="ruleForm.extractionConcentration"></el-input>
            </el-form-item>
            <el-form-item label="宿主率">
              <el-input clearable style="width:210px" v-model="ruleForm.rateOfHost"></el-input>
            </el-form-item>
            <el-form-item label="主诉">
              <el-input clearable style="width:210px" v-model="ruleForm.principalComplaint"></el-input>
            </el-form-item>
            <el-form-item label="临床诊断">
              <el-input clearable style="width:210px" v-model="ruleForm.clinicalDiagnosis"></el-input>
            </el-form-item>
            <el-form-item label="用药">
              <el-input clearable style="width:210px" v-model="ruleForm.medication"></el-input>
            </el-form-item>
            <el-form-item label="重点关注病原">
              <el-input clearable style="width:210px" v-model="ruleForm.focusOnPathogen"></el-input>
            </el-form-item>
            <el-form-item label="培养鉴定结果">
              <el-input clearable style="width:210px" v-model="ruleForm.cultureIdentificationResults"></el-input>
            </el-form-item>
            <el-form-item label="发病时长">
              <el-input clearable style="width:210px" v-model="ruleForm.onsetTime"></el-input>
            </el-form-item>
            <el-form-item label="DNA结果">
              <el-input clearable style="width:210px" v-model="ruleForm.resultDna"></el-input>
            </el-form-item>
            <el-form-item label="DNA检出病原">
              <el-input clearable style="width:210px" v-model="ruleForm.resultDnaOn"></el-input>
            </el-form-item>
            <el-form-item label="RNA结果">
              <el-input clearable style="width:210px" v-model="ruleForm.resultRna"></el-input>
            </el-form-item>
            <el-form-item label="RNA检出病原">
              <el-input clearable style="width:210px" v-model="ruleForm.resultRnaOn"></el-input>
            </el-form-item>
          </el-submenu>
        </el-menu>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="resetRegister('ruleForm')">取消</el-button>
        <el-button size="mini" type="primary" @click="submitRegister('ruleForm')">确定</el-button>
      </span>
    </el-dialog>
    <div class="block">
      <div>
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :page-sizes="[20, 50, 100, 200,500]"
          layout="total, sizes, prev, pager, next, jumper"
          :total="listTotal"
          background
        ></el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
import {
  exportEntryHouse,
  entryHouseList,
  entryHouse,
  entryHouseEdit,
  cancelEntryHouse,
  inputToVoid,
  inputEnabled
} from "@/api/technologyManage/index.js";
import {voidPlaceOn,delPlaceOn,manageOperation} from '@/api/commonArr/index.js'
import { arr, Arr } from "@/utils/data.js";
export default {
  data() {
    return {
      pickerOptions: {
        disabledDate(time){
          return time.getTime()>Date.now()
        },
        shortcuts: [{
          text: '最近一周',
          onClick(picker) {
            const end = new Date();
            const start = new Date();
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
            picker.$emit('pick', [start, end]);
          }
        }, {
          text: '最近一个月',
          onClick(picker) {
            const end = new Date();
            const start = new Date();
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
            picker.$emit('pick', [start, end]);
          }
        }, {
          text: '最近三个月',
          onClick(picker) {
            const end = new Date();
            const start = new Date();
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
            picker.$emit('pick', [start, end]);
          }
        }]
      },
      loading:false,
      value1: [],
      value2: [],
      multipleSelection: [],
      restaurants: [],
      tableData: [],
      dialogVisible: false,
      row:{},
      rules: {
        experimentalStatus: [
          { required: true, message: "请选择状态", trigger: "change" }
        ]
      },
      rules4: {
        dictReasonId: [
          { required: true, message: "请输入作废原因", trigger: "change" }
        ]
      },
      projectTypeList:[],
      ruleForm: {},
      nullifyDialog: false,
      params: {
        pageNum: 1,
        pageSize: 20,
        projectType: "",
        sampleType: "",
        nucleicAcidType: "",
        platformType: "",
        experimentalStatus: "",
        inputState: ""
      },
      listTotal: 0,
      entryHouseData: {
        ids: []
      },
      arr: {},
      id: "",
      Arr: {},
      ids: [],
      ruleForm4: {},
      heights: undefined,
      stateId:'',
      sampleTypeList:[]
    };
  },
  methods: {
    // 下拉框
    querySearch(queryString, cb) {
      var restaurants = this.restaurants;
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString))
        : restaurants;
      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    createFilter(queryString) {
      return restaurant => {
        return (
          restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) ===
          0
        );
      };
    },
    // 多个下拉框的数据
    loadAll() {
      const array = [
        this.sampleTypeList,
        this.projectTypeList,
        
      ];
      return array;
    },
    handleSelect(item) {
      console.log(item);
    },
    // 聚焦下拉框时
    change(i) {
      this.restaurants = this.loadAll()[i];
      // console.log(this.restaurants);
    },
    // 表格复选框
    handleSelectionChange(val) {
      this.multipleSelection = val;
      this.ids = val.map(item => item.id);
    },
    edit(row) {
      this.dialogVisible = true;
      this.ruleForm = row;
    },
    //编辑
    submitRegister(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          const data = {
            experimentalStatus: this.ruleForm.experimentalStatus,
            remark: this.ruleForm.remark,
            id: this.ruleForm.id
          };
          entryHouseEdit(data).then(() => {
            this.$message.success("修改成功");
            this.dialogVisible = false;
            this.getList();
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    resetRegister(formName) {
      this.$refs[formName].resetFields(); //清空
      this.dialogVisible = false;
    },

    entryHouse() {
      if (this.multipleSelection.length == 0) {
        this.$message.error("请勾选内容");
        return;
      }
      this.entryHouseData.ids = [];
      this.$confirm("是否入库?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.multipleSelection.forEach(el => {
            this.entryHouseData.ids.push(el.id);
          });
          this.entryHouseData.remark = this.tableData[0].remark;
          return entryHouse(this.entryHouseData);
        })
        .then(() => {
          this.$message({
            type: "success",
            message: "入库成功!"
          });
          this.getList();
        });
    },
    cancelEntryHouse() {
      if (
        this.multipleSelection.length === 0 
      ) {
        this.$message.error("请勾选内容");
        return;
      }
      this.$confirm("是否取消入库?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          let ids=[]
          this.multipleSelection.forEach(el => {
            ids.push(el.id);
          });
          return cancelEntryHouse(ids);
        })
        .then(() => {
          this.$message({
            type: "success",
            message: "取消入库成功!"
          });
          this.getList();
        });
    },
    nullify(id,stateId,row) {
      this.row=row
      this.stateId=stateId
      this.id = id;
      this.nullifyDialog = true;
    },
    voidPlaceOn(){
      voidPlaceOn({stateId:this.stateId,status:0}).then(()=>{
      })
    },
    sureToNullify(formName) {
      
      this.$refs[formName].validate(valid => {
        if (valid) {
          inputToVoid({
            dictReasonId: this.ruleForm4.dictReasonId,
            id: this.id
          }).then(() => {
            this.$message.success("已作废");
            this.nullifyDialog = false;
            this.getList();
            this.voidPlaceOn()
            this.row.status=0
        this.row.operationStatus=0
        this.row.entryDate=this.row.inputDate
        // this.row.sampleType=this.row.sampleTypeId
        // this.row.registrationTime=this.row.registerCreateDate
        // this.row.projectType=this.row.projectTypeId
        manageOperation(this.row)
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    handleExport() {
      const queryParams = this.params;
      this.$confirm("是否确认导出数据?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(function() {
          return exportEntryHouse(queryParams);
        })
        .then(response => {
          this.download(response.msg);
        });
    },
    getList() {
      this.loading=true
      entryHouseList(this.params).then(res => {
        this.tableData = res.rows;
        this.listTotal = res.total;
        this.loading=false
      });
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.params.pageSize = val;
      this.getList();
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.params.pageNum = val;
      this.getList();
    },
    timeChange1() {
      if(!this.value1){
        this.value1=[]
      }
      this.params.registrationStartTime = this.value1[0];
      this.params.registrationEndTime = this.value1[1];
    },
    timeChange2() {
      if(!this.value2){
        this.value2=[]
      }
      this.params.inputStartDate = this.value2[0];
      this.params.inputEndDate = this.value2[1];
    },
    reset() {
      this.params = {
        pageNum: 1,
        pageSize: 20,
        projectType: "",
        sampleType: "",
        nucleicAcidType: "",
        platformType: "",
        experimentalStatus: "",
        inputState: ""
      };
      this.value1=[]
      this.value2=[]
      this.getList();
    },
    handleOpen(key, keyPath) {
      console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    },
    toEnabled(id,row) {
      this.$confirm("是否确认启用?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        inputEnabled({ id }).then(() => {
          this.$message.success("启用成功");
          this.getList();
          delPlaceOn(row.stateId)
        });
      });
    },
    rowStyle({ row }) {
      var arr = this.ids;
      for (let i = 0; i < arr.length; i++) {
        if (row.id === arr[i]) {
          return "rowStyle";
        }
      }
    },
    handleCommand(command) {
      this.params.pageSize = command;
      this.handleExport();
    },
    getDefaultDate(){
      var now = new Date();
      var date = now.getDate();      
      // now.setDate(date - 1);  //获取前一天
      var y = now.getFullYear();
      var m = (now.getMonth() + 1).toString().padStart(2, "0");
      var d = now.getDate().toString().padStart(2, "0");
      var defaultDate = y + "-" + m + "-" + d+' '+'00:00:00';
     
      var defaultDate2 = y + "-" + m + "-" + d+' '+'23:59:59';   
      this.$set(this.value1,0,defaultDate),
      this.$set(this.value1,1,defaultDate2)
      // this.$set(this.value2,0,defaultDate),
      // this.$set(this.value2,1,defaultDate2)
      this.timeChange1()
        // this.timeChange2()
    },
    handleSelectSample(item) {
      this.params.sampleType=item.id
    },
    handleSelectProject(item){
      this.params.projectType=item.id
    },
  },
  mounted() {
    this.getList();
    this.arr = arr;
    this.Arr = Arr;
    // console.log(this.Arr.sampleTypeArr);
    // this.Arr.sampleTypeArr.map(el=>{
    //   this.sampleTypeList.push({
    //     value:el.name
    //   })
    // })
    this.$nextTick(() => {
      // 根据浏览器高度设置初始高度
      this.heights =
        window.innerHeight - this.$refs.refsTable.offsetHeight - 150;
      // 监听浏览器高度变化，修改表格高度
      window.onresize = () => {
        this.heights =
          window.innerHeight - this.$refs.refsTable.offsetHeight - 150;
      };
    });
  },
  updated() {
    this.$refs["multipleTable"].doLayout();
  },
  created() {
    this.getDefaultDate();
    Arr.sampleTypeArr.map(el=>{
      this.sampleTypeList.push({
        value:el.name,
        id:el.id
      })
    })
    Arr.projectTypeArr.map(el=>{
      this.projectTypeList.push({
        value:el.name,
        id:el.id
      })
    }) 
  }
};
</script>

<style lang="scss" scoped>
.packages {
  padding-left: 10px;
  // position: relative;
  .czDiv {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-evenly;
  }
  .block {
    width: 100%;
    // height: 50px;
    background-color: #fff;
    position: absolute;
    display: flex;
    flex-direction: row-reverse;
    bottom: 10px;
    right: 20px;
    z-index: 99;
  }
  .el-col-5 {
    width: 20%;
  }

  ::v-deep .el-table__body tr.current-row > td {
    background: #a8d6fe !important;
  }
  ::v-deep .rowStyle {
    background-color: #a8d6fe !important;
  }
  ::v-deep .el-table__body tr:hover > td {
    background: #a8d6fe !important;
  }
  .el-row {
    display: flex;
    flex-wrap: wrap;
  }
  .el-form-item {
    margin-bottom: 10px;
  }
  .topDiv {
    ::v-deep .el-form-item__label {
      font-size: 12px;
      padding: 0 5px 0 0;
      margin: 0;
    }
  }
      //表头
      thead th:not(.is-hidden):last-child {
      border-left: 1px solid #EBEEF5;
    }
    //表单
   .el-table__row {
      td:not(.is-hidden):last-child {
        border-left: 1px solid #e4e7ec;
      }
    }
    .el-table__row td:not(.is-hidden):last-child {   //将单元格右移一像素，在没有像本文中特殊设置表头表单的 生效。
       right: -1px;
     }
    thead th:not(.is-hidden):last-child {
       right: -1px;
    }


}
</style>